<template>
	<view class="container" v-if="loaded">
			
		<view
			v-for="(platform, pindex) in platformList" 
			:key="pindex"
			v-show="currentPlatform == pindex"
		>
			<view 
				v-for="(tab, tindex) in platform.tabs" 
				:key="tindex"
				v-show="currentTab == tindex"
			>
				<view class="good-list">
					<goods-list-item
						v-for="(item, index) in tab.list"
						:item="item"
						:key="index"
						:index="index"
						@on-item-click="onGoodClick"
						@on-share-click="onShareClick"
					/>
				</view>
			</view>
		</view>
		
		<uni-load-more :status="platformList[currentPlatform].tabs[currentTab].loadingMore ? 'loading' : ''"></uni-load-more>
		<good-share  ref="goodShare" />
		
	</view>
</template>

<script>
	import { JSMRequest } from '@/module/api'
	import { avatarUrl, getRandMobile, encodeGoodId } from '@/common/util'
    import WxNotificationCenter from '@/libs/WxNotificationCenter/wxnotificationcenter'
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue"
	import goodsListItem from '@/components/goods-list-item/goods-list-item'
	import GoodShare from '@/components/good-share/good-share'

	const _ = require("@/libs/underscore/underscore-min.js")._
	
	export default {
		components: {
			uniLoadMore,
			goodsListItem,
			GoodShare

		},
		data() {
			return {
				loaded: false,
				currentTab: 0,
				advs: [],
				platformList: [
					{ 
						name: '', 
						value: 'jd',
						tabs: []
					}
				],
				currentPlatform: 0,
				// 1：综合  2：销量降序 3：销量升序  4：价格升序  5：价格降序 6：佣金比例降序 7：佣金比例升序
				orderByList: [
					{
						name: '综合',
						child: [
							{
								name: '综合',
								value: 1
							},
							{
								name: '佣金比例降序',
								value: 6
							},
							{
								name: '佣金比例升序',
								value: 7
							}
						],
						type: 'select',
						status: false
					},
					{
						name: '销量',
						child: [
							{
								name: '销量降序',
								value: 2
							},
							{
								name: '销量升序',
								value: 3
							}
						],
						type: 'click'
					},
					{
						name: '价格',
						child: [
							{
								name: '价格降序',
								value: 5
							},
							{
								name: '价格升序',
								value: 4
							}
						],
						type: 'click'
					}
				],
				showOrderByListSelect: false,
				showAddTips: true,
				buyList: [],
				showSort: false,
				exParams: {},
				isJd: true,
			};
		},
		
		computed: {
			shareAppMessage () {
				return this.$store.state.shareAppMessage
			},
			
			userInfo () {
				return this.$store.state.userInfo
			}
		},
		
		onShareAppMessage (e) {
			return this.shareAppMessage
		},
		
		onReachBottom() {
			let _t = this
			let currentPlatform = this.currentPlatform
			let currentTab = this.currentTab
			let platform = this.platformList[currentPlatform]
			let tab = platform.tabs[currentTab]
			
			if(!tab.loaded) return false
			if(tab.isEmpty) return false
			if(tab.loadingMore) return false
			
			tab.page ++
			tab.loadingMore = true
			
			this.getPageData()
		},
		
		onLoad(options) {
			let _t = this
			let loaded = 0
			let params = options.params || "{}"
			
			params = JSON.parse(decodeURIComponent(params))
			
			uni.showLoading({
				title: "加载中..."
			})
			
			this.exParams = params.exParams || {}
			this.showSort = params.showSort || false
			this.isJd = params.type == 2
			
			if(params.name){
				uni.setNavigationBarTitle({
					title: params.name
				})
			}
			
			if(params.platform){
				this.platformList[0].value = params.platform
			}
			
			if(params.showCate){
				// 获取分类
				
			}else{
				_.each(this.platformList, (platform, index) => {
					let tabs = []
					
					tabs.push({
						value: 0,
						name: "",
						list: [],
						page: 1,
						sortBy: 1,
						loaded: false,
						isEmpty: false,
						loadingMore: true,
						currentOrderBy: 0,
						currentOrderByChild: [0, 0, 0],
						currentOrderBySelect: null
					})
					
					platform.tabs = tabs
					this.getPageData(index)
					
					loaded ++
					if(loaded == _t.platformList.length){
						_t.loaded = true
						uni.hideLoading()
					}
				})
			}
			
		},
		
		methods:{
			onAdClick (item, index) {
				if(!_.isEmpty(item.url)){
				    if(item.url.indexOf("http")>-1){
						uni.navigateTo({
							url: "/pages/common/webview/webview?uri=" + item.url + "&title="+ item.name
						})
				    }else{
				        try {
							let url = JSON.parse(item.url)
							if(url.mpweixin){
								let mpweixin = url.mpweixin
								console.log(mpweixin)
								let path = mpweixin.path
								if(mpweixin.params){
									path += path.indexOf("?") > -1 ? "&params=" : "?params="
									path += encodeURIComponent(JSON.stringify(mpweixin.params))
								}

								uni.navigateTo({
									url: path
								})
							}
				        } catch (e) {
				         
				        }
				    }
				}
			},
			
			// 排序
			onSortByClick (item, index) {
				let _t = this
				let currentPlatform = this.currentPlatform
				let currentTab = this.currentTab
				let platform = this.platformList[currentPlatform]
				let tab = platform.tabs[currentTab]
				
				if(item.type == 'click'){
					if(tab.currentOrderBy == index){
						tab.currentOrderByChild[index] = tab.currentOrderByChild[index] == 0 ? 1 : 0
						tab.sortBy = this.orderByList[index].child[tab.currentOrderByChild[index]].value
					}else{
						tab.currentOrderBy = index
						tab.currentOrderByChild[index] = 0
						tab.sortBy = this.orderByList[index].child[0].value
					}
					
					tab.page = 1
					tab.list = []
					tab.loadingMore = true
					tab.isEmpty = false
					
					this.onCloseSelectSortByClick()
					this.getPageData()
				}else{
					this.showOrderByListSelect = true
				}
			},
			
			// 排序下拉
			onSelectSortByClick (item, index, pindex){
				let _t = this
				let currentPlatform = this.currentPlatform
				let currentTab = this.currentTab
				let platform = this.platformList[currentPlatform]
				let tab = platform.tabs[currentTab]
				
				if(tab.currentOrderByChild[pindex] == index && tab.currentOrderBy == pindex){
					this.onCloseSelectSortByClick()
				}else{
					tab.currentOrderBy = pindex
					tab.currentOrderByChild[pindex] = index
					tab.sortBy = this.orderByList[pindex].child[index].value
					
					tab.page = 1
					tab.list = []
					tab.loadingMore = true
					tab.isEmpty = false
					
					this.onCloseSelectSortByClick()
					this.getPageData()
				}
			},
			
			onCloseSelectSortByClick () {
				this.showOrderByListSelect = false
			},
			
			onGoodClick (item, index){
				// console.log(item)
				if(item.item_id){
					uni.navigateTo({
						url: "/pages/home/good-detail/good-detail?id=" + item.item_id
					})
				}else{
					uni.navigateTo({
						url: "/pageSupplier/supplier/good-detail/good-detail?isSupplierGood=0&id=" + item.id
					})
				}
			},

			onShareClick (item, index) {
				if(this.userInfo == null){
					return uni.navigateTo({
						url: "/pages/index/index"
					})
				}
				
				// 绑定邀请码
				if(!this.userInfo.parent){
					return uni.navigateTo({
						url: "/pageMe/me/bind-invite/bind-invite"
					})
				}
				
				let type = item.item_id ? 1 : 2
				let id = item.item_id || item.id
				let codeStr = '- - -$￥' + encodeGoodId(id.toString()) + '1￥$- - -';
				let copyText = item.title || item.goods_name
				
				this.$refs.goodShare.show({
					id,
					type,
					text: copyText
				})
			},
			
			getPageData (index) {
				let _t = this
				let currentPlatform = index || this.currentPlatform
				let currentTab = this.currentTab
				let platform = this.platformList[currentPlatform]
				let tab = platform.tabs[currentTab]
				
				JSMRequest({
					tag: this.isJd ? "jsm-good-list" : "jsm-self-good-list",
					params: Object.assign({
						page: tab.page
					}, this.exParams)
				}).then(({ data }) => {
					let list = tab.page == 1 ? [] : tab.list
					list = list.concat(data.self)
					list = list.concat(data.jd)
					
					tab.list = list
					// tab.isEmpty = data.length < 10
					tab.loadingMore = false
					tab.loaded = true
				}).catch(e => {
					tab.isEmpty = true
					tab.loadingMore = false
					tab.loaded = true
				})
				
			},
			
			onTabClick (index) {
				this.currentTab = index
				
				let currentPlatform = this.currentPlatform
				let currentTab = index
				let platform = this.platformList[currentPlatform]
				let tab = platform.tabs[currentTab]
				
				if(!tab.loaded) this.getPageData()
			}
		}
	}
</script>

<style lang="less" scoped>
	.scrollview{
		white-space: nowrap;
	}
	
	.container{
		padding-bottom: 20px;
	}
	
	.list_tabs{
		background: #FFFFFF;
		height: 76px;
		border-bottom: 1px solid #eee;
		
		.item{
			display: inline-block;
			height: 76px;
			padding: 0 20px;
			text-align: center;
			position: relative;
				
			&:first-child{
				margin-left: 10px;
			}
			
			&:last-child{
				margin-right: 10px;
			}
			
			text{
				color: #666;
				font-size: 28px;
				line-height: 76px;
			}
			
			.line{
				position: absolute;
				bottom: 6px;
				left: 50%;
				margin-left: -12px;
				height: 4px;
				width: 24px;
				background-color: #fff;
			}
			
			&.current{
				
				text{
					color: #FF3660;
				}
			}
		}
	}
	
	.banner{
		position: relative;
		width: 100%;
		overflow-x: hidden;
		
		.swiper{
			width: 100%;
			height: 320px;
			overflow: hidden;
			margin: 0 auto;
		}
		
		.swiper-item{
			
			.img{
				width: 100%;
				height: 320px;
			}
		}
	}
	
	.sortby{
		position: sticky;
		top: 0px;
		left: 0;
		z-index: 5;
		background-color: #FFFFFF;
		
		width: 100%;
		height: 92px;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
		
		.li{
			width: 250px;
			height: 92px;
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			
			.touch{
				width: 180px;
				height: 52px;
				display: flex;
				flex-direction: row;
				justify-content: center;
				align-items: center;
				background: #f2f2f2;
				border-radius: 26px;
			}
			
			text{
				font-size: 22px;
				color: #333333;
			}
			
			.icons{
				margin-left: 8px;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
			}
			
			.icon{
				width: 12px;
				height: 8px;
				margin: 2px 0;
			}
			
			&.current{
				.touch{
					background: #fff;
					box-sizing: border-box;
					border: 1px solid #FC1F42;
				}
				
				
				text{
					color: #FC1F42;
				}
			}
			
			.sub{
				width: 750px;
				height: 1334px;
				position: absolute;
				top: 92px;
				left: 0;
				
				.shadow{
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					bottom: 0;
					background: rgba(0,0,0,.75);
				}
				
				.con{
					background: #F2F2F2;
					border-radius: 0 0 20px 20px;
					padding-bottom: 20px;
					padding-top: 10px;
					overflow: hidden;
					position: relative;
					
					.cli{
						height: 80px;
						display: flex;
						flex-direction: row;
						align-items: center;
						justify-content: space-between;
						padding: 0 30px;
						
						text{
							font-size: 28px;
							color: #666;
						}
						
						.icon{
							width: 24px;
							height: 16px;
						}
						
						&.current{
							
							text{
								color: #FF3660;
							}
						}
					}
				}
			}
		}
	}
	
	.good-list{
		// min-height: 994px;
		padding: 20px 30px 0;
	}
</style>
